﻿<phone:PhoneApplicationPage 
    x:Class="Cet.IO.DemoModbusNetduino.BoardLayoutPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:local="clr-namespace:Cet.IO.DemoModbusNetduino"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="False"
    >

    
    <phone:PhoneApplicationPage.Resources>
        
        <SolidColorBrush x:Key="WireBrush">Gray</SolidColorBrush>
        
        
        <DataTemplate x:Key="dtplInputPort">
            <StackPanel
                Orientation="Horizontal"
                Margin="1"
                >
                <Line
                    X1="0"
                    Y1="20"
                    X2="60"
                    Y2="20"
                    Stroke="{StaticResource WireBrush}"
                    StrokeThickness="2"
                    />
                
                <local:LedControl
                    Value="{Binding Path=Value}"
                    Width="36"
                    Height="36"
                    Margin="4,0,0,0"
                    />
            </StackPanel>
        </DataTemplate>


        <DataTemplate x:Key="dtplOutputPort">
            <CheckBox
                IsChecked="{Binding Path=Value, Mode=TwoWay}"
                Content="{Binding Path=Description}"
                VerticalAlignment="Center"
                Margin="40,0,0,0"
                />
        </DataTemplate>


        <DataTemplate x:Key="dtplAnalogPort">
            <Grid
                Margin="1,4"
                >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>

                <TextBlock
                    Text="{Binding Path=VoltageValue, StringFormat='{}{0:F3}V'}"
                    Grid.Row="0" Grid.Column="0"
                    />

                <TextBlock
                    Text="{Binding Path=RawValue, StringFormat='Raw={0}'}"
                    Grid.Row="0" Grid.Column="1"
                    />
                
                <ProgressBar
                    Value="{Binding Path=PercentValue}"
                    Minimum="0"
                    Maximum="100"
                    Grid.Row="1" Grid.Column="0"
                    Grid.ColumnSpan="2"
                    />
            </Grid>
        </DataTemplate>

    </phone:PhoneApplicationPage.Resources>
    
    
    <!--LayoutRoot contains the root grid where all other page content is placed-->
    <Grid x:Name="LayoutRoot">
        <controls:Panorama Title="NetMF Modbus">
            
            <!--Assigns a background image to the Panorama control.-->
            <controls:Panorama.Background>
                <ImageBrush ImageSource="Images/panorama-background.png"/>
            </controls:Panorama.Background>
            
            <!--Panorama item one-->
            <controls:PanoramaItem Header="Input ports">
                <Grid>
                    <Canvas>
                        <Image
                            Source="/Cet.IO.DemoModbusNetduino_WP;component/Images/netduino_1-8.png"
                            Canvas.Left="0"
                            Canvas.Top="30"
                            />

                        <ItemsControl
                            x:Name="icInputs"
                            ItemTemplate="{StaticResource dtplInputPort}"
                            Canvas.Left="200"
                            Canvas.Top="60"
                            Width="200"
                            >
                        </ItemsControl>
                    </Canvas>
                </Grid>
            </controls:PanoramaItem>

            
            <!--Panorama item two-->
            <controls:PanoramaItem Header="Output ports">
                <Grid>
                    <Canvas>
                        <Image
                            Source="/Cet.IO.DemoModbusNetduino_WP;component/Images/netduino_9-13.png"
                            Canvas.Left="0"
                            Canvas.Top="50"
                            />

                        <ItemsControl
                            x:Name="icOutputs"
                            ItemTemplate="{StaticResource dtplOutputPort}"
                            Canvas.Left="200"
                            Canvas.Top="20"
                            Width="200"
                            >
                        </ItemsControl>
                        
                        <Line
                            X1="172"
                            Y1="150"
                            X2="240"
                            Y2="70"
                            Stroke="{StaticResource WireBrush}"
                            StrokeThickness="2"
                            />

                        <Line
                            X1="172"
                            Y1="190"
                            X2="240"
                            Y2="138"
                            Stroke="{StaticResource WireBrush}"
                            StrokeThickness="2"
                            />

                        <Line
                            X1="172"
                            Y1="228"
                            X2="240"
                            Y2="205"
                            Stroke="{StaticResource WireBrush}"
                            StrokeThickness="2"
                            />

                        <Line
                            X1="172"
                            Y1="270"
                            X2="240"
                            Y2="275"
                            Stroke="{StaticResource WireBrush}"
                            StrokeThickness="2"
                            />

                        <Line
                            X1="172"
                            Y1="310"
                            X2="240"
                            Y2="340"
                            Stroke="{StaticResource WireBrush}"
                            StrokeThickness="2"
                            />

                        <Line
                            X1="172"
                            Y1="355"
                            X2="240"
                            Y2="405"
                            Stroke="{StaticResource WireBrush}"
                            StrokeThickness="2"
                            />
                    </Canvas>
                </Grid>
            </controls:PanoramaItem>

            
            <!--Panorama item three-->
            <controls:PanoramaItem Header="Analog ports">
                <Grid>
                    <Canvas>
                        <Image
                            Source="/Cet.IO.DemoModbusNetduino_WP;component/Images/netduino_an.png"
                            Canvas.Left="200"
                            Canvas.Top="20"
                            />

                        <ItemsControl
                            x:Name="icAnalogs"
                            ItemTemplate="{StaticResource dtplAnalogPort}"
                            Canvas.Left="10"
                            Canvas.Top="65"
                            Width="200"
                            >
                        </ItemsControl>
                    </Canvas>
                </Grid>
            </controls:PanoramaItem>
        </controls:Panorama>
    </Grid>

    <!--Panorama-based applications should not show an ApplicationBar-->

</phone:PhoneApplicationPage>